<template>
  <div class="page-container-padding">
    <!-- 切换 -->
    <div>
    <el-tabs v-model="tabName">
      <el-tab-pane name="singleStrategy" label="单边策略">
        <div style="width:880px;">
          <el-row :gutter="8" type="flex" justify="start" align="middle">
            <el-col :span="6"><span class="row-label">品种：</span>
              <el-select v-model="singleObj.variety_en" ref="singleVarietySelect" size="mini" filterable>
                <el-option v-for="item,index in authVarietyList" :value="item.variety_en" :label="item.variety_long_name" :key="index"></el-option>
              </el-select>
            </el-col>
            <el-col :span="6"><span class="row-label">合约：</span>
              <el-select v-model="singleObj.contract" size="mini" filterable>
                <el-option v-for="item,index in singleContractList" :value="item.mix_contract" :label="item.mix_contract" :key="index"></el-option>
              </el-select>
            </el-col>
            <el-col :span="6"><span class="row-label">方向：</span>
              <el-select v-model="singleObj.direction" size="mini">
                <el-option value="B" label="多头"></el-option><el-option value="S" label="空头"></el-option>
              </el-select>
            </el-col>
            <el-col :span="6"><span class="row-label">价格单位：</span><el-input size="mini" v-model.trim="singleObj.price_unit" style="width: 200px;"></el-input></el-col>
          </el-row>
          <br>
          <el-row :gutter="8" type="flex" justify="start" align="middle">
            <el-col :span="6"><span class="row-label">开仓价：</span><el-input size="mini" v-model="singleObj.strategy_price" style="width: 215px;"></el-input></el-col>
            <el-col :span="6"><span class="row-label">目标价：</span><el-input size="mini" v-model="singleObj.target_price" style="width: 215px;"></el-input></el-col>
            <el-col :span="6"><span class="row-label">止损价：</span><el-input size="mini" v-model="singleObj.cutloss_price" style="width: 215px;"></el-input></el-col>
            <el-col :span="6"><span class="row-label">价格区间：</span><span style="color: #1890FF;">{{ (Math.abs(singleObj.target_price / singleObj.strategy_price - 1) * 100).toFixed(2) }}%</span></el-col>
          </el-row>
          <br>
          <el-row :gutter="8" type="flex" justify="start" align="middle">
            <el-col :span="6"><span class="row-label">手数：</span><el-input-number size="mini" style="width: 215px;" v-model="singleObj.hands" :max="999" :min="1"></el-input-number></el-col>
            <el-col :span="18"><span style="color: #F34D37;">保证金比例{{ singleObj.bail_rate * 100 }}%，策略资金{{ (singleObj.fund / 10000).toFixed(0) }}万。(全为保证金计算)</span></el-col>
          </el-row>
          <br>
          <el-row :gutter="8" type="flex" justify="start" align="middle">
            <el-col :span="13"><span class="row-label">理由：</span><el-input size="mini" v-model="singleObj.description" placeholder="输入策略的的理由,开平仓价格无需重复填写." style="max-width: 92%;"></el-input></el-col>
          </el-row>
          <br>
          <el-row :gutter="8" type="flex" justify="start" align="middle">
            <el-col :span="12"><span class="row-label">对外：</span><el-checkbox size="mini" v-model="singleObj.is_open">对外展示</el-checkbox></el-col>
          </el-row>
          <br>
          <el-row>
            <div style="margin-bottom: 5px;">策略预览:<span style="cursor:pointer;margin-left: 8px;color: #1386D2;" @click="previewSingleStrategy"><i class="el-icon-refresh"></i>刷新</span></div>
            <el-col :span="16"><div style="background-color: #f5f5f5;border-radius: 10px;padding: 10px;line-height: 24px;font-size: 16px;">{{ previewSingle }}</div></el-col>
          </el-row>
          <br>
          <el-row justify="space-between">
            <el-col :span="2" :offset="7"><el-button type="primary" style="width: 100%;" :loading="pushStrategyLoading" @click="publishStrategy">确定发布</el-button></el-col>
          </el-row>
        </div>
      </el-tab-pane>
      <el-tab-pane name="doubleStrategy" label="套利策略">
        <div style="width:880px;">
          <el-row :gutter="8" type="flex" justify="start" align="middle">
            <el-col :span="6"><span class="row-label">品种一：</span>
              <el-select v-model="doubleObj.variety_en1" ref="doubleVariety1">
                <el-option v-for="item,index in authVarietyList" :value="item.variety_en" :label="item.variety_name" :key="index"></el-option>
              </el-select>
            </el-col>
            <el-col :span="6"><span class="row-label">合约：</span>
              <el-select v-model="doubleObj.contract1">
                <el-option v-for="item,index in doubleContractList1" :value="item.mix_contract" :label="item.mix_contract" :key="index"></el-option>
              </el-select>
            </el-col>
            <el-col :span="6"><span class="row-label">方向：</span>
              <el-select v-model="doubleObj.direction1">
                <el-option value="B" label="多头"></el-option><el-option value="S" label="空头"></el-option>
              </el-select>
            </el-col>
            <el-col :span="6"><span class="row-label">价格单位：</span><el-input v-model.trim="doubleObj.price_unit1" style="width: 200px;"></el-input></el-col>
          </el-row>
          <br>
          <el-row :gutter="8" type="flex" justify="start" align="middle">
            <el-col :span="6"><span class="row-label">手数：</span><el-input-number style="width: 215px;" v-model="doubleObj.hands1" :max="999" :min="1"></el-input-number></el-col>
            <el-col :span="18"><span style="color: #F34D37;">保证金比例{{ doubleObj.bail_rate1 * 100 }}%，策略资金{{ (doubleObj.fund1 / 10000).toFixed(0) }}万。(全为保证金计算)</span></el-col>
          </el-row>
          <br>
          <el-row :gutter="8" type="flex" justify="start" align="middle">
            <el-col :span="6"><span class="row-label">品种二：</span>
              <el-select v-model="doubleObj.variety_en2" ref="doubleVariety2">
                <el-option v-for="item,index in authVarietyList" :value="item.variety_en" :label="item.variety_name" :key="index"></el-option>
              </el-select>
            </el-col>
            <el-col :span="6"><span class="row-label">合约：</span>
              <el-select v-model="doubleObj.contract2">
                <el-option v-for="item,index in doubleContractList2" :value="item.mix_contract" :label="item.mix_contract" :key="index"></el-option>
              </el-select>
            </el-col>
            <el-col :span="6"><span class="row-label">方向：</span>
              <el-select v-model="doubleObj.direction2">
                <el-option value="B" label="多头"></el-option><el-option value="S" label="空头"></el-option>
              </el-select>
            </el-col>
            <el-col :span="6"><span class="row-label">价格单位：</span><el-input v-model.trim="doubleObj.price_unit2" style="width: 200px;"></el-input></el-col>
          </el-row>
          <br>
          <el-row :gutter="8" type="flex" justify="start" align="middle">
            <el-col :span="6"><span class="row-label">手数：</span><el-input-number style="width: 215px;" v-model="doubleObj.hands2" :max="999" :min="1"></el-input-number></el-col>
            <el-col :span="18"><span style="color: #F34D37;">保证金比例{{ doubleObj.bail_rate2 * 100 }}%，策略资金{{ (doubleObj.fund2 / 10000).toFixed(0) }}万。(全为保证金计算)</span></el-col>
          </el-row>
          <br>
          <el-row :gutter="8" type="flex" justify="start" align="middle">
            <el-col :span="6"><span class="row-label">开仓价差：</span><el-input v-model="doubleObj.strategy_price" style="width: 215px;"></el-input></el-col>
            <el-col :span="6"><span class="row-label">目标价差：</span><el-input v-model="doubleObj.target_price" style="width: 215px;"></el-input></el-col>
            <el-col :span="6"><span class="row-label">止损价差：</span><el-input v-model="doubleObj.cutloss_price" style="width: 215px;"></el-input></el-col>
            <el-col :span="6"><span class="row-label">价格区间：</span><span style="color: #1890FF;">{{ (Math.abs(doubleObj.target_price / doubleObj.strategy_price - 1) * 100).toFixed(2) }}%</span></el-col>
          </el-row>
          <br>
          <el-row :gutter="8" type="flex" justify="start" align="middle">
            <el-col :span="13"><span class="row-label">理由：</span><el-input v-model="doubleObj.description" placeholder="输入策略的的理由,开平仓价格无需重复填写." style="max-width: 92%;"></el-input></el-col>
          </el-row>
          <br>
          <el-row :gutter="8" type="flex" justify="start" align="middle">
            <el-col :span="12"><span class="row-label">对外：</span><el-checkbox v-model="doubleObj.is_open">对外展示</el-checkbox></el-col>
          </el-row>
          <br>
          <el-row>
            <div style="margin-bottom: 5px;">套利策略预览:<span style="cursor:pointer;margin-left: 8px;color: #1386D2;" @click="previewDoubleStrategy"><i class="el-icon-refresh"></i>刷新</span></div>
            <el-col :span="16"><div style="background-color: #f5f5f5;border-radius: 10px;padding: 10px;line-height: 24px;font-size: 16px;">{{ previewDouble }}</div></el-col>
          </el-row>
          <br>
          <el-row justify="space-between">
            <el-col :span="2" :offset="7"><el-button type="primary" style="width: 100%;" :loading="pushStrategyLoading" @click="publishStrategy">确定发布</el-button></el-col>
          </el-row>
        </div>
      </el-tab-pane>
    </el-tabs>
    </div>
    <!-- 策略说明 -->
    <div style="margin-top:15px;line-height:22px;padding: 3px 5px;border-top-left-radius:5px;border-top-right-radius:5px;">
      <span class="explain-title">一、工作说明</span>
      <br>1、针对有短线行情机会的品种，撰写短线交易策略。交易策略在《瑞智综合管理平台》填写发布并跟踪。
      <br><span class="explain-title">二、工作要求</span>
      <br>1、每个品种每月至少 1 条。
      <br>2、策略撰写盈亏比需要达到 2:1 以上，且波动 2%以上。单边策略每条最高可用 30 万金额，套利策略每条最高可用 60 万金额，资金使用比例自己安排，保证金按交易所两倍计算。
      <br>3、策略发布 30 天没达到目标位或者没点击操作算失效。
      <br>4、策略以静态方式发布，即要求建仓后要等待运行到目标位或者止损位。
      <br>5、要当天及时对策略进行跟踪及在系统中进行点选确认操作。
      <br><span class="explain-title">三、考核评价</span>
      <br>1、主要考虑投顾策略的成功率。数量达到要求的根据成功率进行排名，数量没达标的按数量为基础，成功率大小进行排名。
      <br>2、成功率=成功数/结束量。
      <br>3、部门可安排人员进行抽查验证，对有问题策略进行处罚。如弄虚做假；价格、时间点选不严谨等行为，被抽查不合格的记录不进行统计。
    </div>
  </div>
</template>

<script>
  let NAME_SPACE = 'V02'
  import { getVarietyContract } from '@/api/variety'
  import { getUserAuthVariety } from '@/api/operations/variety'
  import { publishStrategy } from '@/api/departmentWork/strategy'
  export default {
    data(){
      return {
        pushStrategyLoading: false,
        authVarietyList: [],
        tabName: 'singleStrategy',
        singleContractList: [],
        doubleContractList1: [],
        doubleContractList2: [],
        // 单边策略对象
        singleObj: {
          variety_en: '',
          contract: '',
          direction: 'B',
          price_unit: '',
          hand_amount: 1,
          fund: 300000,
          bail_rate: 0,
          strategy_price: null,
          target_price: null,
          cutloss_price: null,
          hands: 1,
          description: '',
          is_open: true
        },
        previewSingle: '', // 单边策略预览
        previewDouble: '', // 套利策略预览
        // 套利策略对象
        doubleObjVariety: '',
        doubleObj: {
          variety_en1: '',
          variety_en2: '',
          contract1: '',
          contract2: '',
          direction1: 'B',
          direction2: 'B',
          price_unit1: '',
          price_unit2: '',
          hand_amount1: 1,
          hand_amount2: 1,
          hands1: 1,
          hands2: 1,
          fund1: 300000,
          fund2: 300000,
          bail_rate1: 0,
          bail_rate2:0,
          strategy_price: null,
          target_price: null,
          cutloss_price: null,
          description: '',
          is_open: true
        }

      }
    },
    mounted() {
      this.getUserVariety()
    },
    computed:{
      // 配合watch
      singleObjVariety(){
        return this.singleObj.variety_en
      },
      singleStrategyPrice(){
        return this.singleObj.strategy_price
      },
      singleTargetPrice(){
        return this.singleObj.target_price
      },
      singleDescript(){
        return this.singleObj.description
      },
      doubleObjVariety1(){
        return this.doubleObj.variety_en1
      },
      doubleObjVariety2(){
        return this.doubleObj.variety_en2
      },
      doubleDescript(){
        return this.doubleObj.description
      }
    },
    watch:{
      singleObjVariety(){
        this.getContract('single')  // 查询合约
      },
      singleStrategyPrice(){
        // 计算手数
        this.singleObj.hands = Math.floor(this.singleObj.fund / (parseFloat(this.singleObj.strategy_price) * this.singleObj.hand_amount * this.singleObj.bail_rate))
      },
      singleDescript(){
        this.previewSingleStrategy()  // 策略预览。
      },

      doubleObjVariety1(){
        this.getContract('double1')
      },
      doubleObjVariety2(){
        this.getContract('double2')
      },
      doubleDescript(){
        this.previewDoubleStrategy()  // 套利策略预览
      }

    },
    methods: {
      getUserVariety() {
        getUserAuthVariety({ space: NAME_SPACE }).then((res) => {
          this.authVarietyList = res.data
        })
      },

      getContract(current){
        const variety = current =='single'?this.singleObjVariety:current == 'double1'?this.doubleObj.variety_en1:this.doubleObj.variety_en2
        getVarietyContract({v: variety}).then(res => {
          if (current=='single'){
            this.singleContractList = res.data
            if (this.singleContractList && this.singleContractList.length>0){
              const contractItem = this.singleContractList[0]
              this.singleObj.contract = contractItem.mix_contract
              this.singleObj.price_unit = contractItem.price_unit
              this.singleObj.hand_amount = contractItem.hand_amount
              this.singleObj.fund = contractItem.fund
              this.singleObj.bail_rate = contractItem.bail_rate
            }
          }else if (current == 'double1'){
            this.doubleContractList1 = res.data
            if (this.doubleContractList1 && this.doubleContractList1.length>0){
              const contractItem1 = this.doubleContractList1[0]
              this.doubleObj.contract1 = contractItem1.mix_contract
              this.doubleObj.price_unit1 = contractItem1.price_unit
              this.doubleObj.hand_amount1 = contractItem1.hand_amount
              this.doubleObj.fund1 = contractItem1.fund
              this.doubleObj.bail_rate1 = contractItem1.bail_rate
            }
          }else if (current == 'double2'){
            this.doubleContractList2 = res.data
            if (this.doubleContractList2 && this.doubleContractList2.length>0){
              const contractItem2 = this.doubleContractList2[0]
              this.doubleObj.contract2 = contractItem2.mix_contract
              this.doubleObj.price_unit2 = contractItem2.price_unit
              this.doubleObj.hand_amount2 = contractItem2.hand_amount
              this.doubleObj.fund2 = contractItem2.fund
              this.doubleObj.bail_rate2 = contractItem2.bail_rate
            }
          }

        })
      },

      previewSingleStrategy(){
        this.previewSingle = `【交易策略】建议于${this.singleObj.strategy_price}${this.singleObj.price_unit}附近${this.singleObj.direction=='B'?'做多':'做空'}${this.singleObj.contract},
                               目标${this.singleObj.target_price}${this.singleObj.price_unit},止损${this.singleObj.cutloss_price}${this.singleObj.price_unit}。${this.singleObj.description}`
      },
      previewDoubleStrategy(){
        this.previewDouble = `【套利策略】建议${this.doubleObj.contract1}与${this.doubleObj.contract2}合约价差为${this.doubleObj.strategy_price}时，
                              ${this.doubleObj.direction1=='B'?'做多':'做空'}${this.doubleObj.contract1}，
                              ${this.doubleObj.direction2=='B'?'做多':'做空'}${this.doubleObj.contract2}，价差为${this.doubleObj.target_price}时止盈，
                              止损价差为${this.doubleObj.cutloss_price}附近。${this.doubleObj.description}`
      },

      // 发布策略
      publishStrategy(){
        let strategyData;
        if (this.tabName === 'singleStrategy'){
          // 单边策略
          const straDetail1 = [{
            variety_name: this.$refs.singleVarietySelect.selectedLabel,
            variety_en: this.singleObj.variety_en,
            contract: this.singleObj.contract,
            price_unit: this.singleObj.price_unit,
            bail_rate: this.singleObj.bail_rate,
            exchange_mul: this.singleObj.hand_amount,
            direction: this.singleObj.direction,
            hands: this.singleObj.hands
          }]
          strategyData = {
            type: 1,
            ykb: 0,
            is_open: this.singleObj.is_open?1:0,
            variety_en: this.singleObj.variety_en,
            description: this.singleObj.description,
            fund: this.singleObj.fund,
            strategy: JSON.stringify(straDetail1),
            strategy_price: this.singleObj.strategy_price,
            target_price: this.singleObj.target_price,
            cutloss_price: this.singleObj.cutloss_price
          }
          if (this.previewSingle.length<1){
            this.$baseMessage('请先刷新预览策略再发布!', 'error')
            return false
          }

        } else if (this.tabName == 'doubleStrategy'){
          // 套利策略
          const straDetail2 = [
            {
              variety_name: this.$refs.doubleVariety1.selectedLabel,
              variety_en: this.doubleObj.variety_en1,
              contract: this.doubleObj.contract1,
              price_unit: this.doubleObj.price_unit1,
              direction: this.doubleObj.direction1,
              bail_rate: this.doubleObj.bail_rate1,
              exchange_mul: this.doubleObj.hand_amount1,
              hands: this.doubleObj.hands1,
              fund: this.doubleObj.fund1
            },{
              variety_name: this.$refs.doubleVariety2.selectedLabel,
              variety_en: this.doubleObj.variety_en2,
              contract: this.doubleObj.contract2,
              price_unit: this.doubleObj.price_unit2,
              direction: this.doubleObj.direction2,
              bail_rate: this.doubleObj.bail_rate2,
              exchange_mul: this.doubleObj.hand_amount2,
              hands: this.doubleObj.hands2,
              fund: this.doubleObj.fund2
            }
          ]
          strategyData = {
            type: 2,
            ykb: 0,
            is_open: this.doubleObj.is_open?1:0,
            variety_en: this.doubleObj.variety_en1,
            description: this.doubleObj.description,
            fund: parseFloat(this.doubleObj.fund1 + this.doubleObj.fund2),
            strategy: JSON.stringify(straDetail2),
            strategy_price: this.doubleObj.strategy_price,
            target_price: this.doubleObj.target_price,
            cutloss_price: this.doubleObj.cutloss_price
          }

          if (this.previewDouble.length<1){
            this.$baseMessage('请先刷新预览套利策略再发布!', 'error')
            return false
          }
        }else{
          return false
        }
        // 发布
        this.pushStrategyLoading = true
        publishStrategy(strategyData).then(res => {
          this.$baseMessage(res.msg, 'success')
          this.previewSingle = ''
          this.pushStrategyLoading = false
        }).catch(err => {
          this.pushStrategyLoading = false
        })
      }
    }
  }
</script>

<style scoped>
  .row-label{
    min-width: 60px;
    display: inline-block;
    font-weight: 700;
  }
  .explain-title{
    font-weight:700;
    color: #006eff;
  }
</style>
